<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>八礼官网</title>
<link rel="stylesheet" type="text/css" href="css/common.css"/>
<link rel="stylesheet" type="text/css" href="css/flexslider.css" /> 
<link rel="stylesheet" type="text/css" href="css/jquery.mCustomScrollbar.min.css"/>
<link rel="stylesheet" type="text/css" href="css/index.css"/>

<link rel="stylesheet" type="text/css" href="css/animate.min.css"/>
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/jquery-screen.js"></script>
<script type="text/javascript" src="js/TweenMax.min.js"></script> 
<script type="text/javascript" src="js/jquery.flexslider-min.js"></script>
<script type="text/javascript" src="js/jquery.SuperSlide.2.1.1.js"></script>
<script type="text/javascript" src="js/scrollReveal.js"></script>


<script type="text/javascript">
/* wow = new WOW({
      animateClass: 'animated',
      offset:100
});
wow.init(); */
$(function(){
	//banner轮播
	 $("#wrapper .flexslider").flexslider({
	    	slideshowSpeed:14000,
	        directionNav:false,
	        init: function(slider){
	        	var target = slider.slides.eq(slider.animatingTo);
	            var t = new TimelineMax();
	            if (slider.animatingTo == 0)
	            {
	                t.fromTo(target.find('.move_text'), 2, {left: '0%'}, {left: '5%'});

	            }
	        },
	        before: function(slider) {
	           var target = slider.slides.eq(slider.animatingTo);
	           var t = new TimelineMax();
	           if (slider.animatingTo == 0)
	           {
	               t.fromTo(target.find('.move_text'), 2, {left: '0%'}, {left: '5%'});

	           }
	           if (slider.animatingTo == 1)
	           {
	               t.fromTo(target.find('.move_text'), 2, {right: '30%'}, {right: '50%'});
	           }
	           if (slider.animatingTo == 2)
	           {
	               t.fromTo(target.find('.move_text'), 2, {left: '30%'}, {left: '50%'});
	           }
	       }
	    }); 
	 //案例展示轮播
	    $(".case .flexslider").flexslider({
	        animation: "slide",
	        animationLoop: false,
	        itemWidth: 210,
	        itemMargin: 5,
	        minItems: 3,
	        maxItems: 3
	       // pausePlay: true
	    });
	//文字抖动渐出效果
	//window.scrollReveal = new scrollReveal({ reset: true, move: '50px'});
})


</script>
</head>
<body>
<div id="wrapper">
    <div class="logo-bg"><div class="logo auto"><p>领先的积分化运营服务商</p></div></div>
	<div class="flexslider m0"> 
	      <ul class="slides"> 
	        <li>
	            <img src="images/1-banner1.jpg" />
	            <div class="banner1_title move_text">
		            <p class="f26">领先的积分化运行服务商</p>
		            <p class="p_title f40">互联网时代精准营销倡导者</p>
		            <p class="p_des f18">The age of the Internet's new precision marketing advocates</p>
	            </div>
	        </li> 
	        <li>
	            <img src="images/1-banner2.jpg" /><!--
	            <div class="banner2_title move_text">
	                <p class="f26">积分化运营------开启新智能经济时代</p>
	                <p class="p_title f40">O2O企业一站式精准营销解决方案</p>
	            </div>-->
	        </li> 
	        <li>
	            <img src="images/1-banner3.jpg" />
	            <div class="banner3_title move_text">
	                <p class="f26">企业CRM系统运营专家</p>
	                <p class="p_title f40">互联网金融机构可信赖合作伙伴</p>
	            </div>
	        </li> 
	      </ul> 
	</div>
</div>
<div id="nav">
   <a class="nav_menu"></a>
   <div class="nav_zhezhao"></div>
   <div class="nav_content">
	        <ul>
	           	<li class="active" name="wrapper"><span>HOME</span> 首页</li>
	            <li name="cooperation"><span>COOPERATION</span> 合作伙伴</li>
	            <li name="application-main"><span>APPLICATION</span> 应用场景</li>
	            <li name="advantage"><span>ADVANTAGE</span> 企业优势</li>
	            <li name="case-main"><span>EXHIBITION</span> 案例展示</li>
	            <li name="about-main"><span>ABOUT US</span> 关于我们</li>

	        </ul>
	        <div class="erweima">
	           <img src="images/2-erweima.png"/>
	           <div class="weibo">
	               <span class="xinlang"></span>
	               <span class="weixin"></span>
                </div>
	        </div>
	        <div class="toor">
               <div class="weibo">
                   <span class="dian">
	                   <p>来电咨询</p>
                   </span>
                   <span class="top" onclick="javascript:scroll(0,0)">
	                    <p>返回顶部</p>
                   </span>
                </div>
            </div>
	</div>
</div>
<div class="cooperation" id="cooperation">
	<div class="cooperation-main auto">
		<div class="cooperation-top">
			<h2><img src="images/2-hzhb.png" alt="" /></h2>
			<div class="title " >
				<h1 class="f36">八礼，都为“谁”挖掘出精准营销背后的价值宝藏？</h1>
				<p class="f18">Who chose to go in the era of science and technology front of us?</p>
			</div>
		</div>
		<div class="cooperation-bottom">
			<div class="tab"><span class="on">企业</span><span>供应商</span></div>
			<script type="text/javascript">
			$(function(){
			
				
				//tab切换
				$(".cooperation-bottom .tab span").click(function(){
					var index = $(this).index();
					$(this).addClass("on").siblings().removeClass("on");
					$(".cooperation-bottom .tab-contents").hide();
					$(".cooperation-bottom .tab-contents").eq(index).show();
				});
			})
			</script>
			<div class="bank tab-contents">
				<ul>
					<li style="background:url(images/2-zhonghang.png) no-repeat center center"></li>
					<li style="background:url(images/2-pingan.png) no-repeat center center"></li>
					<li style="background:url(images/2-huatai.png) no-repeat center center"></li>
					<li style="background:url(images/2-pufa.png) no-repeat center center"></li>
					<li style="background:url(images/2-guotai.png) no-repeat center center"></li>
					<li style="background:url(images/2-ningbo.png) no-repeat center center"></li>
					<li style="background:url(images/2-jiaotong.png) no-repeat center center"></li>
					<li style="background:url(images/2-yinyan.png) no-repeat center center"></li>
					<li style="background:url(images/2-jianshe.png) no-repeat center center"></li>
					<li style="background:url(images/2-liantong.png) no-repeat center center"></li>
					<li style="background:url(images/2-guangfa.png) no-repeat center center"></li>
					<li style="background:url(images/2-zhongtou.png) no-repeat center center"></li>
					<li style="background:url(images/2-rencai.png) no-repeat center center"></li>
					<li style="background:url(images/2-guangda.png) no-repeat center center"></li>
					<li style="background:url(images/2-renshou.png) no-repeat center center"></li>
					<li style="background:url(images/2-yangguang.png) no-repeat center center"></li>
					<li style="background:url(images/2-diyichuangy.png) no-repeat center center"></li>
					<li style="background:url(images/2-huaan.png) no-repeat center center"></li>
				</ul>
			</div>
			<div class="bank tab-contents" style="display: none">
				<ul>
					<li style="background:url(images/2-boss.png) no-repeat center center"></li>
					<li style="background:url(images/2-pingg.png) no-repeat center center"></li>
					<li style="background:url(images/2-yilaikesi.png) no-repeat center center"></li>
					<li style="background:url(images/2-aimeite.png) no-repeat center center"></li>
					<li style="background:url(images/2-ck.png) no-repeat center center"></li>
					<li style="background:url(images/2-lekou.png) no-repeat center center"></li>
					<li style="background:url(images/2-yalan.png) no-repeat center center"></li>
					<li style="background:url(images/2-huawei.png) no-repeat center center"></li>
					<li style="background:url(images/2-dishini.png) no-repeat center center"></li>
					<li style="background:url(images/2-jbl.png) no-repeat center center"></li>
					<li style="background:url(images/2-suboer.png) no-repeat center center"></li>
					<li style="background:url(images/2-luoji.png) no-repeat center center"></li>
					<li style="background:url(images/2-huiren.png) no-repeat center center"></li>
					<li style="background:url(images/2-jiuyang.png) no-repeat center center"></li>
					<li style="background:url(images/2-xinxiuli.png) no-repeat center center"></li>
					<li style="background:url(images/2-wanbaol.png) no-repeat center center"></li>
					<li style="background:url(images/2-meidi.png) no-repeat center center"></li>
					<li style="background:url(images/2-jundao.png) no-repeat center center"></li>
				</ul>
			</div>
		</div>
	</div>
</div>
<script type="text/javascript">
$(function(){
	//应用切换
	$(".application-bottom .kk").hover(function(){
		$(this).removeClass("model");
		$(this).addClass("onmodel").siblings().removeClass("onmodel").addClass("model");;
	});
})
</script>
<div class="application" >
	<div class="application-main" id="application-main">
		<div class="content auto">
			<div class="application-top" >
				<h2><img src="images/3-yycj.png" alt="" /></h2>
				<div class="title " data-scroll-reveal="enter bottom and move 50px over 1.33s">
					<h1 class="f36">我们能解决你以下问题......</h1>
					<p class="f18">What can we solve your problem</p>
				</div>
			</div>
			<div class="application-bottom">
				<div class="onmodel jifen kk">
					<div class="model-top">积分商城</div>
					<div class="model-footer">
						<div class="title">盘活企业的积分体系<br>拓展更大市场</div>
						<div class="detail">
							<p>盘活企业的积分体系，拓展更大市场</p>
							<ul class="info">
								<li>●&nbsp;&nbsp;数据分析</li>
								<li>●&nbsp;&nbsp;消费行为挖掘</li>
								<li>●&nbsp;&nbsp;监测营销效果</li>
								<li>●&nbsp;&nbsp;生成定制方案</li>

							</ul>
							<a href="product.html#product">了解更多</a>
						</div>
					</div>
				</div>
				<div class="model fuli kk">
					<div class="model-top">员工福利</div>
					<div class="model-footer">
						<div class="title">快速提升企业忠诚度<br>留住优质人才</div>
						<div class="detail">
							<p>快速提升企业忠诚度，留住优质人才</p>
							<ul class="info">
								<li>●&nbsp;&nbsp;礼品定制</li>
								<li>●&nbsp;&nbsp;福利管理</li>
								<li>●&nbsp;&nbsp;成本控制</li>
								<li>●&nbsp;&nbsp;采购发放</li>
								<li>●&nbsp;&nbsp;团建/企业文化</li>
							</ul>
							<a href="product.html#product">了解更多</a>
						</div>
					</div>
				</div>
				<div class="model caiji kk">
					<div class="model-top">采集管理</div>
					<div class="model-footer">
						<div class="title">精准采购&配送服务<br>节省更多成本</div>
						<div class="detail">
							<p>精准采购&配送服务，节省更多成本</p>
							<ul class="info">
								<li>●&nbsp;&nbsp;商品仓储管理</li>
								<li>●&nbsp;&nbsp;商品抽检</li>
								<li>●&nbsp;&nbsp;包装&增值服务</li>
								<li>●&nbsp;&nbsp;专业物流配送</li>
							</ul>
							<a href="product.html#product">了解更多</a>
						</div>
					</div>
				</div>
				<div class="model yunying kk">
					<div class="model-top">运营管理</div>
					<div class="model-footer">
						<div class="title">专人帮企业管理平台<br>解决后顾之忧</div>
						<div class="detail">
							<p>专人帮企业管理平台，解决后顾之忧</p>
							<ul class="info">
								<li>●&nbsp;&nbsp;商品库存管理</li>
								<li>●&nbsp;&nbsp;定期更新商品</li>
								<li>●&nbsp;&nbsp;服务器管理&维护</li>
								<li>●&nbsp;&nbsp;服务器负载均衡</li>
								<li>●&nbsp;&nbsp;数据库搭建&备份</li>
								<li>●&nbsp;&nbsp;网站设计优化</li>
							</ul>
							<a href="product.html#product">了解更多</a>
						</div>
					</div>
				</div>
			</div>
		</div>	
	</div>

</div>
<div class="advantage" id="advantage">
	<div class="advantage-main auto">
		<div class="advantage-top">
			<h2><img src="images/4-qyys.png" alt="" /></h2>
			<div class="title " data-scroll-reveal="enter bottom and move 150px over 1.33s">
				<h1 class="f36">凭什么说“客户优选我们”？</h1>
				<p class="f18">"Customers preferred us" for what?</p>
			</div>
		</div>
		<div class="advantage-bottom">
			<div class="tab f_left"><span class="on">覆盖面广<i class="on"></i></span><span>服务深度<i></i></span><span>专业性强<i></i></span></div>
			<script type="text/javascript">
			$(function(){
				//tab切换
				$(".advantage-bottom .tab span").hover(function(){
					var index = $(this).index();
					$(this).addClass("on").siblings().removeClass("on");
					$(this).find("i").addClass("on");
					$(this).siblings("span").find("i").removeClass("on");
					$(".advantage-bottom .tab-contents").hide();
					$(".advantage-bottom .tab-contents").eq(index).show();
				});
			})
			</script>
			<div class="fgm tab-contents f_right">
				<h3>企业全渠道互联网+积分运营服务体系</h3>
				<p class="detail">营销策划，员工福利，积分兑换，流量变现</p>
				<p class="more"><a href="product.html#power">了解更多</a></p>
			</div>
			<div class="service tab-contents f_right" style="display: none">
				<h3><p>针对用户痛点制定解决方案</p><p>全方位提升企业的品牌满意度</p></h3>
				<p class="detail">有效提升商品兑换率，深度激活流量变现率</p>
				<p class="more"><a href="product.html#power">了解更多</a></p>
			</div>
			<div class="zyx tab-contents f_right" style="display: none">
				<h3>高可用性，高安全性</h3>
				<h5 class="detail"><p>（高可用性）多服务器群组，支持TCP协议/UDP协议</p><p>（高安全性）SSL安全认证，双中心数据实时同步&自动备份</p></h5>
				<p class="more"><a href="product.html#power">了解更多</a></p>
			</div>
		</div>
	</div>
</div>
<!-- 案例展示 -->
<div class="case_bg" >
    <div class="case">
	    <div class="case-main auto" id="case-main">
	        <div class="case-top">
	            <h2><img src="images/5-alzs.png" alt="" /></h2>
	            <div class="title " data-scroll-reveal="enter top and move 150px over 1.33s">
	                <h1 class="f36">我们不讲故事,只讲事实</h1>
	                <p class="f18">DONT'T TELL A STORY, ONLY SPEAK THE TRUE</p>
                </div>
	        </div>
	        <script type="text/javascript">
			$(function(){
				jQuery(".case-bottom").slide({titCell:".hd ul",mainCell:".bd ul",autoPage:true,effect:"leftLoop",autoPlay:true,vis:3});
			})
			</script>
	        <div class="case-bottom">
	      		<div class="hd">
					<a class="next"></a>
					<a class="prev"></a>
				</div>
				<div class="bd">
					<ul class="picList">
						<li>
							<div class="pic"><img src="images/5-anli1.jpg" /></div>
							<div class="title">
								<p class="bt">佳兆业</p>
								<p class="info">佳兆业文体旅游集团官网规划概念性方案</p>
							</div>
						</li>
						<li>
							<div class="pic"><img src="images/5-anli2.jpg" /></div>
							<div class="title">
								<p class="bt">威马汽车</p>
								<p class="info">威马汽车会员积分营销创意方向概念性方案</p>
							</div>
						</li>
						<li>
							<div class="pic"><img src="images/5-anli3.jpg" /></div>
							<div class="title">
								<p class="bt">GREI</p>
								<p class="info">GREI”品牌故事创意方向概念性方案</p>
							</div>
						</li>
						<li>
							<div class="pic"><img src="images/5-anli4.jpg" /></div>
							<div class="title">
								<p class="bt">安信证券</p>
								<p class="info">安信证券移动端积分商城搭建及营销方案</p>
							</div>
						</li>
						<li>
							<div class="pic"><img src="images/5-anli5.jpg" /></div>
							<div class="title">
								<p class="bt">广发银行</p>
								<p class="info">广发银行新品发布方案</p>
							</div>
						</li>
						<li>
							<div class="pic"><img src="images/5-anli6.jpg" /></div>
							<div class="title">
								<p class="bt">建设银行</p>
								<p class="info">建设银行积分商城营销方案</p>
							</div>
						</li>
					</ul>
				</div>
	      		
	        </div>
	    </div>
    </div>
</div>
<!-- about us  -->
<div class="about" >
    <div class="about-main auto" id="about-main">
        <div class="about-top">
            <h2><img src="images/6-gywm.png" alt="" /></h2>
        </div>
        <div class="about-bottom">
            <div class="contract">
                <p class="address">地址：深圳市南山区科技园软件产业基地5栋B座304 邮政编码：518000</p>
                <p class="worktime">工作时间：周一至周五 09:00-18:00（法定节假日除外）</p>
                <ul class="contract_type">
                    <li class="customer">400--083-660</li>
                    <li class="email">info@818gifts.com</li>
                    <li class="fax">0755-82701463</li>
                </ul>
                <div id="allmap"></div>
            </div>
            <div class="descript content mCustomScrollbar">
                <h2>深圳市八方有礼科技有限公司</h2>
                <p>八礼网（深圳市八方有礼科技有限公司）成立于2011年，自创立以来，我们始终秉承“不断创新、超越自我”、“高端礼品服务商”的发展观，坚持“细节决定成败”的管理理念，立足广东珠三角地区，面向全国快速崛起，八礼网礼品自选模式迅速得到市场认可。 </p>
                <p>八礼网特有的采购、库存、包装、配送及售后服务等平台优势，充分保障了客户对礼品的选择、确认、积分、兑换信息的管理，为您提供完善的从礼品创意到设计成型的全系列服务，并能结合各地汇集的精品之作，为您提供更多样、周到的选择。</p>
                <p>“自选礼品册”能够满足企业对商务回馈、员工福利、广告促销、会议礼品、节日礼品等各种需求。“自选礼品册”模式区别于传统礼品公司的核心，是将传统的“买卖”关系升级为“供应链外包”的服务关系。未来八礼网的发展规划是：迅速将成熟的“自选礼品册”模式复制至全国，通过扩大业务规模来完善商业采购、物流配送、仓储信息化管理、客户需求管理、客户关系维护体系，进一步实现产业的横向延伸与商业模式的转型。</p>
                <h2 class="addus">加入我们</h2>
                <div class="job">
                    <h3>大客户经理 <span>Account Manager</span></h3>
                    <div class="work_desc">
                        <h1>任职要求</h1>
	                    <ul>
	                        <li>1、大专以上学历， 3年以上品牌商品开发、商户开拓、供应链资源拓展等相关工作经验；</li>
	                        <li>2、熟悉电商行业、零售业等品牌商品资源，了解电商平台运营管理模式;从事过相关品牌的开发与管理工作；</li>
	                        <li>3、熟悉产品开发流程及产品管理工作； </li>
	                        <li>4、良好的市场分析、资源整合能力、思维灵活且有逻辑性，敏锐的市场分析能力，善于解决各种业务问题； </li>
	                        <li>5、良好的时间管理能力、逻辑思维能力、沟通能力及团队协作能力。 </li>
	                        <li>职位月薪：面议</li>
	                        <li>工作地点：深圳市南山区科技园软件产业基地5栋B座304 </li>
	                        <li>工作性质：全职 </li>
	                        <li>工作年限：3年以上</li>
	                        <li>最低学历：本科 </li>
	                        <li>招聘人数：2人 </li>
                            <li>福利待遇 :</li>
                            <li>通讯补贴、弹性工作、带薪年假、交通补助、五险一金、绩效奖金、节日福利、员工旅游</li>
                            <li>邮箱：shijl@818gifts.com  联系电话：0755-23600425</li>
	                    </ul>
	                </div>
                    <h3>销售经理<span>Sales Manager</span></h3>
                    <div class="work_desc">
	                    <h1>任职要求</h1>
	                    <ul>
	                        <li>1、大专以上学历，2年以上直销工作经验,1年以上销售团队管理经验；</li>
	                        <li>2、熟悉掌握公司产品知识，对市场营销工作有较深刻的认识；</li>
	                        <li>3、有良好的市场判断能力和开拓能力，有极强的组织管理能力；</li>
	                        <li>4、责任心强、具有很好的执行力、团队管理能力力及信息管理能力；</li>
	                        <li>5、有证券、银行、保险，礼品行业经验优先。</li>
	                        <li>职位月薪：8000-10000元</li>
	                        <li>工作地点：深圳市南山区科技园软件产业基地5栋B座304</li>
	                        <li>工作性质：全职 </li>
	                        <li>工作年限：1-3年</li>
	                        <li>最低学历：大专 </li>
	                        <li>招聘人数：2人 </li>
                            <li>福利待遇 :</li>
                            <li>通讯补贴、弹性工作、带薪年假、交通补助、五险一金、绩效奖金、节日福利、员工旅游</li>
                            <li>邮箱：shijl@818gifts.com  联系电话：0755-23600425</li>
	                    </ul>
	                </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div id="footer">
    <p>Copyright@2013 八礼科技版权所有粤ICP备11050697号-3</p>
</div>
<script src="js/jquery.mousewheel.min.js"></script>
<script src="js/jquery.mCustomScrollbar.min.js"></script>
<script src="js/jquery.mCustomScrollbar.concat.min.js"></script>
<script type="text/javascript">
$(function(){
	//菜单导航nav
	$('#nav>a').click(function(){
		var className = $(this).attr('class');
		if (className == 'nav_menu')
		{
		    $('#nav').css('width',"230px");
		    $('.nav_content').show();
		   // $('.nav_zhezhao').css({'background':'#7b7b7b','opacity':1});
		    $(this).removeClass('nav_menu').addClass('nav_menu_close');
		}
		else
		{
			$('#nav').css('width',"85px");
			$('.nav_content').hide();
	        $('.nav_zhezhao').css({'background':'black','opacity':0.5});
	        $(this).removeClass('nav_menu_close').addClass('nav_menu');
		}
	})
	

	$('.nav_content li').click(function(){
		$(this).addClass('active').siblings().removeClass('active');
		var name= $(this).attr('name');
		document.getElementById(name).scrollIntoView();
	})

	
	//关于我们介绍
	$('.job h3').click(function(){
		if ($(this).hasClass('active'))
		{
			 $(this).removeClass('active');
	         $(this).next('.work_desc').hide();
		}
		else
		{
	        $(this).addClass('active').siblings('h3').removeClass('active');
	        $(this).next('.work_desc').show().siblings('.work_desc').hide();
		}
    })
})
</script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.4"></script>
<script type="text/javascript">
    var x = '113.946658';var y = '22.529648';var shopInfo = "<span style='color:Black;font-size:12px;line-height:18px;'>公司名称:深圳市八方有礼科技有限公司 <br/>联系电话: 0755-23600425<br/>公司地址:深圳市南山区科技园软件产业基地5栋B座304 </span>";
    var map = new BMap.Map("allmap"); // 创建Map实例
    var point = new BMap.Point(x, y);
    map.centerAndZoom(point, 15); //设置中心点 和缩放级别
    map.addControl(new BMap.NavigationControl()); //添加鱼骨 
    map.addControl(new BMap.ScaleControl()); // 添加比例尺控件
    map.addControl(new BMap.OverviewMapControl()); //添加缩略地图控件
    map.enableScrollWheelZoom();                  // 启用滚轮放大缩小。
    map.enableKeyboard();                         // 启用键盘操作。
    map.addControl(new BMap.MapTypeControl({ anchor: BMAP_ANCHOR_TOP_RIGHT }));

    var marker = new BMap.Marker(point);
    var infoWindow = new BMap.InfoWindow(shopInfo);  // 创建信息窗口对象
    map.addOverlay(marker);
    marker.addEventListener("click", function () {
        this.openInfoWindow(infoWindow);
    });
    map.openInfoWindow(infoWindow, map.getCenter());      // 打开信息窗口
</script>
</body>
</html>